<template>
  <a class="entry-detail-container" :href="link || null">
    <img :src="img" alt="" />
    <span>{{ text }}</span>
  </a>
</template>

<script>
import img from "@/assets/data/exports/icon@3x.png";
export default {
  props: {
    text: {
      type: String,
      default: "",
    },
    link: {
      type: String,
      default: "",
    }
  },
  data() {
    return {
      img,
    };
  },
};
</script>

<style lang="scss" scoped>
.entry-detail-container {
  height: 42px;
  display: inline-block;
  background: #f6f8ff;
  margin: 3px 0.8vw;
  padding: 5px 1.2vw;
  border-radius: 5px;
  overflow: hidden;
  color: inherit;
  cursor: pointer;
  img {
    width: 30px;
    margin-right: 10px;
    vertical-align: -9px;
  }
  span {
    font-size: 13px;
    line-height: 32px;
    overflow: hidden;
  }
}
</style>
